<template>
  <view class="request-status">
    <slot v-if="statusType === RequestStatusEnum.PENDING" name="pending">
      <Loading></Loading>
    </slot>

    <slot v-else-if="statusType === RequestStatusEnum.ERROR" name="error">
      <view style="color: red">失败</view>
    </slot>

    <slot v-else-if="statusType === RequestStatusEnum.SUCCESS" name="success">
      <Success style="color: green"></Success>
    </slot>
  </view>
</template>

<script setup lang="ts">
import { RequestStatusEnum } from "../../hooks/useRequestStatus";
import { Loading, Success } from "@nutui/icons-vue-taro";

defineProps<{
  statusType: RequestStatusEnum | undefined;
}>();
</script>

<style lang="scss">
.request-status {
  display: inline-block;
  margin: 0 5px;
  line-height: 0;
}
</style>
